import * as React from 'react';
import {connect} from 'react-redux';
import * as actions from '../../actions';
import {IStoreState} from "../../types";

interface IState {
    name: string,
}

export interface IProps {
    name: string,
}

// function makeId(): string {
//     let text = "";
//     let possible = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
//     for (let i = 0; i < 5; i++) {
//         text += possible.charAt(Math.floor(Math.random() * possible.length));
//     }
//     return text;
// }

class Home extends React.Component<IProps, IState> {
    constructor(props: IProps) {
        super(props);
        this.state = {
            name: 'foo'
        };
    }

    public render() {
        return (
            <React.Fragment>
                <span>{this.state.name}</span>
            </React.Fragment>
        )
    }
}

export function mapStateToProps(state: IStoreState) {
    return {
        name: state.name,
    }
}

export function mapDispatchToProps(dispatch: any) {
    return {
        setName: () => {
            dispatch(actions.setName(''))
        }
    }
}

export default connect(
    mapStateToProps,
    mapDispatchToProps
)(Home);
